<template>
	<view class="cp-top">
		<view class="cp-top-tit flex_fsc">
			<text>测评内容</text>
			<text class="lab">比赛</text>
		</view>
		<view class="cp-gz">
			测试规则: 记录比赛中的结果及主观评价
		</view>
		<view class="cp-ht">&nbsp;</view>
		<view class="table-sty">
			<uni-table>
				<uni-tr class="uni-color-main-bg">
					<uni-th align="center" width="168rpx">测评项目</uni-th>
					<uni-th align="center" width="168rpx">值</uni-th>
					<uni-th align="center" width="168rpx">评分</uni-th>
					<uni-th align="center" width="168rpx">失误点</uni-th>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">总杆数</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>杆
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>&nbsp;</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">推杆</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>杆
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>短推</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">短杆</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>100-50码</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>距离控制</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">短杆:一切一推数</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>次
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>&nbsp;</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">障碍区救球</uni-td>
					<uni-td>&nbsp;</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>沙坑</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">救球:一切一推数</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>次
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>&nbsp;</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">求道攻果岭</uni-td>
					<uni-td align="center">250码-220码</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>距离控制</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">障碍区攻果岭</uni-td>
					<uni-td>&nbsp;</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>求道沙坑</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">标准杆功攻果岭</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>洞
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>&nbsp;</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">开球</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>码
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>
						<view class="flex_cc">
							<text>曲线</text><image :src="setting.oss_pub_domain + '/app-img/icon/icon_drop-down.png'" class="cp-scroe-more"></image>
						</view>
					</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">开球: 上球道数</uni-td>
					<uni-td align="center">
						<text class="select-number">180</text>洞
					</uni-td>
					<uni-td>
						<uni-rate size="12" :value="3" color="#E1E3E6" active-color="#FF7742" class="flex_cc"/>
					</uni-td>
					<uni-td>&nbsp;</uni-td>
				</uni-tr>
			</uni-table>
		</view>
	</view>
	<bottom-box :buts="buts" @change="butChange"></bottom-box>
	<!-- <view class="tk-bg">&nbsp;</view> -->
	<!--滑块-->
	<!-- <view class="tk-con">
		<view class="tk-close">
			<image src="../../../../static/icon/tk-close.png"></image>
		</view>
		<view class="tk-con-con">
			<view class="tk-con-num">
				<view class="left-num">0</view>
				<view class="left-num right-num">300</view>
				<view class="current-num" :style="{'left':leftnumber + '%'}">
					{{currentnum}}
				</view>
			</view>
			<slider value="180" @change="sliderChange" min="0" max="300" activeColor="#008965" backgroundColor="#D8D8D8" block-size="20"/>
		</view>
	</view> -->
	<!--选项-->
	<!-- <view class="tk-con">
		<view class="tk-close">
			<image src="../../../../static/icon/tk-close.png"></image>
		</view>
		<view class="tk-con-list flex_fs">
			<text class="select">中心</text>
			<text>偏高</text>
			<text>偏低</text>
			<text>偏后</text>
			<text>偏前</text>
		</view>
	</view> -->
</template>

<script setup>
	import { onShow } from '@dcloudio/uni-app'
	import { ref, reactive, getCurrentInstance } from 'vue';
	const { proxy: that } = getCurrentInstance();
	const buts = [{
		label: '保存',
		bgColor: 'uni-orange-bg',
		width: 300
	}, {
		label: '完成测试',
		bgColor: 'uni-color-main-bg',
		width: 300
	}]
	
	function butChange(e) {
		if (e) {} else {
			uni.navigateTo({
				url: '/pages/ask-questions/answer'
			})
		}
	}
	
	const currentnum = ref(180);
	const leftnumber = ref(parseInt((180 / 300) * 100 - 3));
	function sliderChange(e) {
		currentnum.value = e.detail.value;
		leftnumber.value = parseInt((e.detail.value / 300) * 100 - 3);
	}
</script>

<style lang="scss">
	@import 'evaluation-sznextDetail.scss';
</style>
